<template>
  <Modal v-model="modal" :title="title" width='800'>
    <div class="barcode-modal ht400 scroll">
      <Form :label-width="100" v-if="step===1">
        <Row class="pr">
          <Col span="24">
            <FormItem label="部门选择">
              <Cascader 
                :data="departmentTree"
                :change-on-select='false'
                v-model="value"
                @on-change="onSelectDpt"
                placeholder="请选择地区"
              ></Cascader>
            </FormItem>
          </Col>
        </Row>
        <Row class="pr">
          <Col span="24">
            <FormItem label="经销商选择">
              <SelectList @input='onChangeDealer' ref="dealerList" listType='dealerList'/>
            </FormItem>
          </Col>
        </Row>
        <Row class="pr">
          <Col span="24">
            <FormItem label="返利扣减月份">
              <DatePicker type="month" v-model="rebateMonth"></DatePicker>
            </FormItem>
          </Col>
        </Row>
      </Form>
      <div v-else>
        <homeTable
          :list='list'
          @onSelectionChange="onSelectionChange"
          @onPageSizeChange="onPageSizeChange"
          @onPageChange="onPageChange"
          :isInitHeight='false'
          :pageSizeOpts='[20, 60, 100, 500, 1000]'
          :tableHeight='350'
        />
      </div>
    </div>
    <div slot="footer">
        <Button @click="modal = false" size="large" type="text" v-if="step === 1">取消</Button>
        <Button @click="onSave" :loading='confrimLoading' type="primary" size="large" v-if="step === 1">确认</Button>
        <Button :disabled='allBtnLoading' :loading='selBtnLoading' @click="clearSelected" type="info" size="large" v-if="step === 2">选中规格库存清零</Button>
        <Button :disabled='selBtnLoading' :loading='allBtnLoading' @click="clearAll" type="warning" size="large" v-if="step === 2">当前页规格库存清零</Button>
    </div>
</Modal>
</template>
<script>
import SelectList from '@/components/SelectList';
import homeTable from '@/components/homeTable'

export default {
  components: {
    SelectList, homeTable
  },
  computed: {
    title() {
      return this.step === 1 ? '新增盘存' : '商品盘存'
    }
  },
  data() {
    return {
      id: null,
      modal: false,
      options: {
        tableHeight: 200
      },
      resignBrand: '',
      brand: '',
      loading: false,
      departmentTree: [],
      value: [],
      step: 1,
      distributorId: '',
      distributorContractId: '',
      rebateMonth: '',
      selBtnLoading: false,
      allBtnLoading: false,
      confrimLoading: false,
      list: {
        status: 'pass',
        columns: [{
          type: 'selection',
          width: 60,
          align: 'left',
          fixed: 'left'
        },{
          title: '商品名称',
          key: 'name',
          align: 'left',
        }, {
          title: '当前库存',
          key: 'count',
          align: 'left',
        }],
        currentPage: 1,
        totalItem: 1,
        pageSize: window.$pageSize,
        data: []
      },
      selectedRebateList: []
    };
  },
  methods: {
    onPageChange(number) {
      this.list.currentPage = number;
      this.getData();
    },
    onPageSizeChange(pageSize) {
      this.list.currentPage = 1;
      this.list.pageSize = pageSize;
      this.getData();
    },
    getDptTree() {
      this.$jsonPost('department/listDepartmentTree').then(res => {
        const func = (arr) => {
          arr.forEach(item => {
            item.label = item.name
            item.value = item.id + '&' + item.name
            if(item.children && item.children.length) {
              func(item.children)
            }
          })
        }
        func(res)
        this.departmentTree = res
      })
    },
    onSelectDpt(val) {
      let id = val[val.length-1]
      if(!id) return
      let obj = {
        departId: id.split('&')[0],
        current: 1,
        size: 9999,
        isPage: false
      }
      this.$refs.dealerList.getListDispath('getDealerListByDpt', obj)
    },
    onChangeDealer (val, item) {
      this.distributorId = val
      // this.distributorContractId = item.distributor_contract_id
    },
    onSelectionChange(list) {
      this.selectedRebateList = list.map(item => item.id)
    },
    onSave () {
      if (!this.distributorId) {
        this.$Message.info('请选择经销商')
        return
      }
      if (!this.rebateMonth) {
        this.$Message.info('请选择扣减月份')
        return
      }
      this.confrimLoading = true
      this.getData().then(() => {
        this.step = 2
        this.confrimLoading = false
      }).catch(() => {
        this.confrimLoading = false
      })
    },
    getData() {
      return this.$ajaxPost(`/distributorInventory/findDistributorStockByDistributorId`, {
        current: this.list.currentPage,
        size: this.list.pageSize,
        distributorId: this.distributorId
      }).then(res => {
        this.list.data = res.records || []
        this.list.totalItem = Number(res.total);
      })
    },
    clearSelected() {
      if (!this.selectedRebateList.length) {
        this.$Message.info('请先选择商品')
        return
      }
      this.selBtnLoading = true
      this.rebate(this.selectedRebateList)
    },
    clearAll() {
      this.allBtnLoading = true
      this.rebate(this.list.data.map(item => item.id))
    },
    rebate(list) {
      let m = new Date(this.rebateMonth).getMonth() + 1
      this.$ajaxPost('/distributorInventory/savePcd', {
        distributorId: this.distributorId,
        rebateMonth: m,
        tiredList: list
      }).then(res => {
        this.closeModal()
        this.$Message.success('操作成功')
        this.selBtnLoading = false
        this.allBtnLoading = false
      }).catch(() => {
        this.selBtnLoading = false
        this.allBtnLoading = false
      })
    },
    openModal() {
      this.step = 1
      this.modal = true;
      this.getDptTree()
    },
    closeModal() {
      this.modal = false;
    },
  }
}
</script>

